<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link	href="${pageContext.request.contextPath}/themes/bootstrap/easyui.css"	rel="stylesheet">
<link   href="${pageContext.request.contextPath}/themes/icon.css"	rel="stylesheet">
<script src="${pageContext.request.contextPath}/js/jquery-1.7.2.min.js"></script>
<script src="${pageContext.request.contextPath}/js/jquery.easyui.min.js"></script>
<script src="${pageContext.request.contextPath}/js/easyui-lang-zh_CN.js"></script>
<script	src="${pageContext.request.contextPath}/js/jquery.backstretch.js"></script>
</head>
<script type="text/javascript">
   $(function(){
	   //设置全屏背景图片
		 
		$.backstretch("${pageContext.request.contextPath}/img/backgrounds/2.jpg")
		
	   //默认删除对话框是隐藏的
			$("#deleteEmployee").dialog('close');
	   
	   
		// 配置搜索框	
		   $('#searchEmployee').searchbox({
		    	searcher : function(value, name) { 
					$('#employeeMsg').datagrid('reload', {
						searchname : value,
						searchtype : name
					});
		    		    },  
		    		    menu:'#mm',  
		    	        prompt:'请输入要查询的值...'    
	      });
			
	        // 配置取消搜索     传个空值过去
	        $("#cancleSearch").click(function(){
	        	$('#searchEmployee').searchbox('clear');
	        	$('#employeeMsg').datagrid('reload', {
	        		
				});   			
	        });
			
		//配置数据表格
		$('#employeeMsg').datagrid({
			url : '${pageContext.request.contextPath}/selectEmyployee',
			columns : [ [ {
				field : 'e_id',
				title : '员工表编号',
				width : 60,
				hidden : true
			},{
				field : 'checked',
				checkbox : true,
				width : 150
			}, {
				field : 'e_number',
				title : '编号',
				width : 60,
				align : 'center'
			}, {
				field : 'e_name',
				title : '姓名',
				width : 60,
				align : 'center'
			}, {
				field : 'e_sex',
				title : '性别',
				width : 60,
				align : 'center'
			},{
				field : 'e_age',
				title : '年龄',
				width : 60,
				align : 'center'
			},{
				field : 'e_tel',
				title : '电话',
				width : 110,
				align : 'center'
			},{
				field : 'e_email',
				title : '邮箱',
				width : 110,
				align : 'center'
			},{
				field : 'e_address',
				title : '地址',
				width : 80,
				align : 'center'
			},{
				field : 'e_birthday',
				title : '生日',
				width : 100,
				align : 'center'
			},{
				field : 'e_entrydate',
				title : '进入公司时间',
				width : 100,
				align : 'center'
			},{
				field : 'e_description',
				title : '员工描述',
				width : 160,
				align : 'center'
			},{
				field : 'dept_name',
				title : '所属部门',
				width : 60,
				align : 'center'
			},{
				field : 'dept_id',
				title : '部门编号',
				width : 60,
				align : 'center',
				hidden : true
			},] ],
			toolbar : [ {
				iconCls : 'icon-remove',
				text : '删除员工',
				handler : function() {
					var emps = $("#employeeMsg").datagrid('getSelections');
					if(emps.length == 0){
						$.messager.alert('提示','请至少选择一条数据');   
					}else{
						$("#deleteEmployee").dialog('open');
						var employee = new Array();
						for (var int = 0; int < emps.length; int++) {
							employee[int] = emps[int].e_id;//传一个数组过去
						}
						//配置确定删除事件
						$("#delete").click(function(){
							$.ajax({
								//配置参数
								//请求方式
								   type:'post',
								//需要发起的请求
								   url:'${pageContext.request.contextPath}/deleteEmployee',
							    //需要带什么数据过去
								   data:{'e_id':employee},
								//返回数据类型   
								   dataType:"text",
								   success:function(data){	
									   if(data=="1"){
											$("#deleteEmployee").dialog('close');
											$.messager.alert('我的消息','删除成功','info',function(){
												$('#employeeMsg').datagrid('reload');
											});
										}
								   }
							});
						});
					}
				}
			} ],
			pagination : true,
			striped : true,
			rownumbers : true,
			fitColumns : true,
			autoRowHeight : true,
			resizeHandle : 'right',
			nowrap : true
		});
		
    });
    
 //配置取消删除表单内容事件
	function cancledeleteForm() {
		$("#deleteEmployee").dialog('close');
		$("#delEmp").form('clear');
		$("#employeeMsg").datagrid('unselectAll');
	}
</script>
<body>
	  
	   <div style="margin-top: 35px"></div>
	   <input id="searchEmployee" class="easyui-searchbox"
		data-options="prompt:'输入查询信息',width:250,height:30,menu:'#mm'" >
		<div id="mm" style="width:120px">
		    <div data-options="name:'byname',iconCls:'icon-ok'" id="byname">按名字查询</div>
		    <div data-options="name:'bydept',iconCls:'icon-save'" id="bydept">按部门查询</div>
		</div>
		<a id="cancleSearch" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-back',height:30">返回</a> 
	
		<p style="text-align: center; font-family: inherit; font-size: 25px;">员工信息一览表</p>
		<table id="employeeMsg" title="员工信息表"></table>
	

	<!-- 删除的对话框 -->
	<div id="deleteEmployee" class="easyui-dialog" title="删除员工信息"
		style="width: 300px; height: 185px;background-color: #F0F8FF" data-options="modal:true">
		<form id="delEmp" method="post">
			<div
				style="font-size: 15px; color: red; text-align: center; margin-top: 40px">
				<p>确定要删除这些员工的信息？</p>
			</div>
		</form>
		<div style="text-align: center; padding: 5px 0">
			<a href="javascript:void(0)" class="easyui-linkbutton" id="delete"
				style="width: 80px">确定</a> <a href="javascript:void(0)"
				class="easyui-linkbutton" onclick="cancledeleteForm()"
				style="width: 80px">取消</a>
		</div>
	</div>
</body>
</html>